<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8">
    <title>物料配套申请</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta content="no-cache, no-store, must-revalidate" http-equiv="Cache-Control"/>
    <meta content="no-cache" http-equiv="Pragma"/>
    <meta content="0" http-equiv="Expires"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <link rel="stylesheet" href="../styles/base.css"/>
    <link rel="stylesheet" href="../styles/common.css"/>
    <link rel="stylesheet" href="../styles/font/iconfont.css"/>
    <link rel="stylesheet" href="../js/layui/css/layui.css"  media="all">
    <style>
        #body{
            background:#ddecf5;
            overflow: auto;
        }
        .searchContainer{
            height:90%;
            margin-top:10px;
            min-width: 94%;
            margin-left:3%;
        }
        .headerTitle  .layui-form{
            width:25%;
            margin-left:-40px;
            height:40px;
        }
        .headerTitle .layui-form-item {
            margin-bottom: 15px;
             clear: none;
            zoom: 1;
        }
        .headerTitle span{
           display: inline-block;
            height:40px;
            line-height: 40px;
            font-size: 16px;
        }
        .mastTip{
            color:red;
            margin-right: 5px;
        }
        .formTitle{
            float:left;
            height:40px;
            line-height: 40px;
        }
        .header{
            border-bottom: 2px solid #ccc;
            padding-bottom: 10px;
        }
        .checkBoxClass{
            height:40px;
            width:100%;
            line-height: 40px;
            display: none;
        }
        .checkBoxClass .checkHeader{
            height:40px;
            width:100%;
            line-height: 40px;

        }
        .checkBoxClass .checkHeader span{
            display: inline-block;
            margin-left: 5px;
        }
        .checkText{
            width:97%;
            height:60px;
            border:1px solid #ccc;
        }
        .checkText li{
            float: left;
            width:120px;
            height:60px;
            line-height: 60px;
            text-align: center;
        }
        .checkText li span{
            display: inline-block;
            font-size: 14px;
        }
        .bottomBtn{
            clear: both;
            display: none;
        }
        .bottomBtn button {
            float:right;
            background-color: #eee;
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            text-decoration: none;
            font-weight: 600;
            color: #333;
            position: relative;
            padding: 2px 15px;
            margin-right: 15px;
            margin-top:10px;
            border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;
            border-top-left-radius: 5px;
            border-bottom-left-radius: 5px;
            background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(242,242,242)), color-stop(1, rgb(242,242,242)) );
            cursor: pointer;
        }
        .bottomBtn button:hover{
            color:#fff;
            background:#40E0D0;
        }
        .headerTitle,.checkBoxClass{
            margin-left:15px;
        }
        /*
        --------------------------------*--------------------------
        */
        .formContent input{
            border:1px solid #ccc;
            background:#fff0D6;
        }
        .formContent .layui-form{
            width:45%;
            height:20px;
        }
        .formContent .layui-form-item {
            margin-bottom: 15px;
            clear: both;
            height:20px;
            zoom: 1;
        }
        .formContent .layui-input-block,.formContent .layui-input-block select{
            margin-left: 0px;
            max-height: 20px;
            width:165px;
           /* background:#fff0D6;*/
        }
        .formContent .layui-input-block select{
            background:#fff0D6;
        }
        .formContent textarea{
            background:#fff0D6;
        }
        .formContent .layui-unselect{
           /* height:20px;*/
           /* z-index: 9999;*/
        }
        .layui-select-title{
            z-index: 0;
        }
        .formContent .listsPub{
            width:100%;
        }
        .formContent .listsPub li{
            clear: both;
            display: inline-block;
            width:50%;
            min-height:30px;
            line-height: 30px;
            height:auto;
            margin-top: 10px;
            font: 14px "微软雅黑";
        }
        .formContent .list li .listLeftTitle span{
            color:red;
        }
        .formContent .listsPub li .listLeftTitle{
            text-align: left;
            margin-left: 10px;
            width:38%;
        }
        .formContent .listsPub li .listLeftText{
            width:60%;
        }
        .listsPub li .listLeftTitle, .listsPub li .listLeftText{
            display: inline-block;
            height:30px;
            line-height: 30px;
        }

        .formContent .listsPub li .inputText{
            height:20px;
            width:27%;
            padding-left: 10px;
        }
        .formContent .bottomCheckBox span{
            display: inline-block;
            font: 14px "微软雅黑";
            margin-right: 5px;
        }
        .formContent .bottomCheckBox{
            clear: both;
            width:100%;
            height:auto;
            padding-top: 10px;
            padding-left: 30%;
        }
        .formContent .bottomBtn{
            display: none;
            margin-right: 0px;
        }
        .formContent .bottomBtn button {
            font: 14px "微软雅黑";
            float:right;
            background-color: #eee;
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            text-decoration: none;
            font-weight: 600;
            color: #333;
            position: relative;
            padding: 2px 15px;
            margin-right: 15px;
            margin-top:10px;
            border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;
            border-top-left-radius: 5px;
            border-bottom-left-radius: 5px;
            background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(242,242,242)), color-stop(1, rgb(242,242,242)) );
            cursor: pointer;
        }
        .formContent .bottomBtn button:hover{
            color:#fff;
            background:#40E0D0;
        }
        .formContent .layui-anim-upbit dl{
            /*top:20px;*/
        }
        .formContent .layui-form-selectup dl{
            bottom:22px;
        }
        .formContent .searchContainer{
            clear: both;
            min-height:600px;
            margin-top: 10px;
            overflow-y: auto;
            clear: both;
        }
        .formContent .publicStyle ul li  input{
            padding-left:10px;
            margin-top: 5px;
        }
        .formContent .publicStyle ul li  textarea{
            padding-left:10px;
        }
        .formContent .publicStyle ul li  input::-webkit-input-placeholder {
            /* placeholder颜色  */
            color: #000;
            /* placeholder字体大小  */
            font-size: 14px;
           /* !* placeholder位置  *!
            text-align: right;*/
        }
    </style>
</head>
<body id="body">
    <div class="searchContainer">
        <div class="header">
            <div class="headerTitle"><span>存储库：</span><span>物料库</span></div>
            <div class="headerTitle">
                <div class="formTitle"><span class="mastTip">*</span><span>类型：</span></div>
                <form class="layui-form" action="">
                    <div class="layui-form-item proSelect">
                        <div class="layui-input-block editWidth">
                            <select id="selectclass" name="city" lay-verify=""  lay-filter="watch">
                                <option value="">请选择类型</option>
                            </select>
                        </div>
                    </div>
                </form>

            </div>
        </div>
        <div class="checkBoxClass">
            <div class="checkHeader"><input type="checkbox"/><span>全选</span></div>
        </div>
        <!--<div class="bottomBtn">
            <button class="submitBtn sureBtn">确定</button><button class="reloadBtn">取消</button>
        </div>-->
        <div class="formContent">
            <div class="publicStyle">
                <ul class="listsPub list"></ul>
            </div>
            <div class="bottomBtn blockBtn">
                <button class="submitBtn submint typePOLClick">确定</button><button class="clearBtn">清除</button>
            </div>
            <div></div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="../js/layui/layui.all.js"></script>
<script type="text/javascript" src="../js/layui/layui.js"></script>
<script type="text/javascript" src="../js/common/common.js"></script>
<script type="text/javascript" src="../js/common/utils.js"></script>
<script type="text/javascript" src="../js/common/publicClass.js"></script>
<script typt="text/javascript" src="../js/common/myAjax.js"></script>
<script src="../js/pages/comClass/typeC.js"></script>
<script src="../js/pages/comClass/typePOL.js"></script>
<script>
    (function(){
        //访问权限；
       /* ajaxNewFn("/MaterialsApplication/getAccessForMaterials","",function(str){
            if(str==false){
                layerFn1("您没有权限访问此页面",function(){
                    window.location.href="about:blank";
                    window.opener=null;
                    window.open('','_self');
                    window.close();
                })
            }
        })*/
        maximizeWindow();//设置屏幕大小
        var classTypeStatus=false;
        var checkVal=[];
        var classTypeName="";
        var checkVal=getQueryStringByNameTwo("checkVal");
        var nameArr=getQueryStringByNameTwo("nameArr");
        var typeArr=[];
        typeArr=nameArr.split(",");
        if(nameArr!=undefined&&nameArr!=""){
            if(typeArr.length>0&&checkVal!=""){
                $(".formContent .blockBtn").css({
                    "display":"block"
                })
                $(".header").css({
                    "display":"none"
                })
                $(".formContent .list").empty();
                var classtype=checkVal;
                if(classtype=="C"){
                    typeCFn(checkVal,typeArr,"123");
                }else if(classtype=="POL"){
                    typePOLFn(checkVal,typeArr,"123");
                }else if(classtype=="L"){
                    typeCFn(checkVal,typeArr,"123");
                }else if(classtype=="E"){
                    typeCFn(checkVal,typeArr,"123");
                }
            }
           // renderForm1();
        }else{
            renderForm1();
        }

        function renderForm1(){
            layui.use('form', function(){
                var form = layui.form;//高版本建议把括号去掉，有的低版本，需要加()
                var option="";
                var dat=commonObj.supportApplicat
                for(var i=0;i<dat.length;i++){
                    option+='<option value="'+dat[i].value+'">'+dat[i].type+'</option>'
                }
                $("#selectclass").append(option);
                form.on('select(watch)', function(data){
                    classTypeStatus=true;
                    $(".checkHeader input").removeProp("checked","checked")
                    checkVal=[];
                    $(".checkBoxClass .checkText").remove();
                    var classType=data.value; //得到被选中的值
                    classTypeName=classType;
                    var classList=[];
                    for(var m=0;m<dat.length;m++){
                        if(dat[m].value==data.value){
                            classList=dat[m].datalist;
                        }
                    }

                    createPublic();
                    if(classType==""&&classList.length==0){
                        $(".formContent").css("display","none");
                        $(".bottomBtn").css("display","none");
                        $(".checkBoxClass").css("display","none")
                        //$(".bottomBtn").css("display","none")

                    }else if(classList.length>0){
                        if(classType!=""){
                            $(".formContent").css("display","block");
                            $(".bottomBtn").css("display","block");
                            $(".checkBoxClass").css("display","block")
                        }

                        var classText='<ul class="checkText">'
                        for(var n=0;n<classList.length;n++){
                          classText+='<li><input type="checkbox"/><span>'+classList[n]+'</span></li>'
                        }
                        classText+='</ul>'
                        $(".checkBoxClass").append(classText);
                    }
                });
                form.render("select");

            });
        }
        //取消按钮reload页面
        $(".reloadBtn").click(function(){
            window.location.href=window.location.href;
            window.location.reload;
        })
        //清除按钮
        $(".clearBtn").click(function(){
            createPublic();
            $(".checkHeader input").removeProp("checked")
            $(".checkText input").removeProp("checked");
        })

        $("body").on("click",".checkHeader input",function(){
            var checked=$(".checkHeader input").prop('checked');
            if(checked){
                $(".checkText input").prop("checked","checked");
                for(var i=0;i<$(".checkText input").length;i++){
                    var $i= $(".checkText input")[i];
                    checkVal.push($($i).next().text())
                }
            }else{
                $(".checkText input").removeProp("checked");
                checkVal=[];
            }
        })
        $("body").on("click",".checkText input",function(){
            var checked=$(this).prop('checked');
            if(checked){
                checkVal.push($(this).next().text())
            }else{
                var val=$(this).next().text();
                var index = getIndexof(checkVal,val);
                if(index>(-1)){
                    checkVal.splice(index, 1);
                    $(".checkHeader input").removeProp("checked","checked")
                }
            }
            var flage=0;
            for(var i=0;i<$(".checkText li input").length;i++){
                if($(".checkText li input").eq(i).prop('checked')){
                    //flage=true;
                }else{

                    flage+=1;
                }
            }
            if(flage==0){
                $(".checkHeader input").prop("checked","checked")
            }
        });
        //点击渲染公用参数
       /* $(".sureBtn").click(function(){
            if(classTypeStatus==true){
                classTypeStatus=false;
                createPublic();
                $(".formContent").css("display","block")
            }

        })*/
        function createPublic(){
            var checkValue=[];
            var checkLen=$(".checkText input");
            for(var i=0;i<checkLen.length;i++){
                var checked=$(".checkText input").eq(i).prop('checked');
                if(checked){
                    checkValue.push($(".checkText input").eq(i).next().text())
                }
            }
            if(/*checkValue.length>0&&*/classTypeName!=""){
                $(".formContent .bottomBtn").css({
                    "display":"block"
                })
                $(".formContent .list").empty();
                var classtype=classTypeName;
                if(classtype=="C"){
                    typeCFn(classtype,checkValue);
                }else if(classtype=="POL"){
                    typePOLFn(classtype,checkValue);
                }else if(classtype=="L&S"){
                    typeCFn(classtype,checkValue);
                }else if(classtype=="E"){
                    typeCFn(classtype,checkValue);
                }
            }
        }

    })()
</script>
</html>